<!--
 * @Author: wangming
 * @Date: 2021-10-18 17:44:48
 * @LastEditors: wangming
 * @LastEditTime: 2022-04-11 13:53:12
 * @FilePath: /hanma-application-designer-fed/src/pages/designUniversal/__components__/dynamicForm/mainContent/__layouts/hlTreeListSelect/Stable.vue
 * @Description: 
-->
<template>
  <div>
    <div
      :class="{
        acitvebox: config.key + '_selecttbsearch' == acitvekey,
      }"
    >
      <SearchCom
        @click.native="searchClick"
        v-if="config.tableconfig.__config.openSearch"
        :config="config.tableconfig.__config.searchConfig"
      />
    </div>
    <el-table :data="tableData" border @header-click="headerClick">
      <el-table-column type="selection" width="55"> </el-table-column>
      <el-table-column
        :label-class-name="acitvekey === i.key ? 'header-active' : ''"
        :prop="i.code"
        :label="i.name"
        v-for="(i, index) in columnList"
        :key="index"
        :index="index"
        :fixed="i.fixed"
      >
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import SearchCom from "../hlSearch/index";
export default {
  components: {
    SearchCom,
  },
  props: {
    acitvekey: {
      type: String,
      default: "",
    },
    getEntitymodelList: {
      type: Array,
      default: () => [],
    },
    config: {
      type: Object,
      default: () => {},
    },
  },
  data() {
    return {
      tableData: [{}, {}, {}, {}],
    };
  },
  computed: {
    columnList() {
      return this.getEntitymodelList.filter((i) => i.showColumn !== false);
    },
  },
  methods: {
    headerClick({ index }, event) {
      let form = this.getEntitymodelList[index];
      this.getEntitymodelList.splice(index, 1, {
        name_i18n: "",
        fixed: false,
        ...form,
      });
      this.$emit("header-click", {
        type: "tb_hd",
        form: this.getEntitymodelList[index],
      });
      event.stopPropagation();
    },
    searchClick(event) {
      this.$emit("header-click", {
        type: "tb_search",
        form: this.config.tableconfig.__config.searchConfig,
      });
      event.stopPropagation();
    },
  },
};
</script>
<style lang="scss" scoped>
.acitvebox {
  border: 1px solid #409eff;
}
</style>
